<template>
	<div style="height: 700px;width: 100%;display: flex;">
		<div style="height:700px;width:20%;background-color: #fff;">
		<el-row class="tac">
			    <el-col >
			      <h3 class="mb-2">个人中心</h3>
			      <el-menu
			        default-active="2"
			        class="el-menu-vertical-demo"
			        @open="handleOpen"
			        @close="handleClose"
			      >
			        <el-sub-menu index="1">
			          <template #title>
			            <el-icon><Avatar /></el-icon>
			            <span>资料设置</span>
			          </template>
			            <router-link to="/homejd/settings">
							<el-menu-item index="1-1">修改信息</el-menu-item>
						</router-link>
						<router-link to="/homejd/Pwd">
			            <el-menu-item index="1-2">修改密码</el-menu-item>
						</router-link>
			        </el-sub-menu>
					<el-sub-menu index="2">
					  <template #title>
					    <el-icon><SoldOut /></el-icon>
					    <span>订单中心</span>
					  </template>
					  <router-link to="/orditem">
					    <el-menu-item index="2-1">我的订单</el-menu-item>
						</router-link>
						<el-menu-item index="2-1">我的评价订单</el-menu-item>
					</el-sub-menu>
			        <el-sub-menu index="3">
			          <template #title>
			            <el-icon><Handbag /></el-icon>
			            <span>关注中心</span>
			          </template>
					  <router-link to="">
						<el-menu-item index="3-1">关注的店铺</el-menu-item> 
						 <el-menu-item index="3-2">关注的商品</el-menu-item> 
					  </router-link>
			            
			        </el-sub-menu>
					<el-sub-menu index="4">
					  <template #title>
					    <el-icon><Expand /></el-icon>
					    <span>资金中心</span>
					  </template>
					  <router-link to="homejd/myBalance">
						 <el-menu-item index="4-1">余额宝</el-menu-item>  
					  </router-link>
					</el-sub-menu>
			      </el-menu>
			    </el-col>
			  </el-row>	
		</div>
		<div style="width: 80%; height: 100%; background-color: #FFFFFF;">
		<router-view></router-view>
		 </div>
		
		
</div>
</template>

<script lang="ts" setup>
	import {ref,reactive,onMounted,computed,toRefs} from "vue"
	import {$get,$postj,$postx,$postf} from "../../ajax/index.js"
	import axios from 'axios'
	import store from "../../store/index.js"
	import router from "../../router/index.js"
	import {Check,Delete,Edit,Message,Search,Star,} from '@element-plus/icons-vue'
	
</script>

<style scoped>
	a {
	  text-decoration: none;
	  color: inherit; 
	}
</style>
